<template>
    <button type="button" class="hb-btn bb animation" v-text="txt" :class="clr" @click="$emit('clk')" />
</template>

<script>
export default {
    name: "hbBtn",
    props: {
        txt: {
            default: "按钮"
        },
        clr: {
            default: "s0"
        }
    },
    data() {
        return {}
    },
    created() {},
    methods: {}
}
</script>

<style scoped>
.hb-btn {
    border-radius: 4px;
    width: 200px;
    font-size: 16px;
    line-height: 48px;
}
.s0 {
    background-color: #7a98f7;
    color: white;
}
.s0:hover {
    background-color: #445eaa;
}
.s1 {
    background-color: #262c46;
    color: white;
}
.s1:hover {
    background-color: #181b2a;
}
</style>